<template>
    <div style="padding: 0 20px">
        <div style="width: 100%; height: 100%">
            <el-form
                label-width="100px"
                v-model="expressInfo"
            >
                <div
                    class="base-info"
                    v-for="(item,index) in expressInfo"
                    :key="index"
                >
                    <div class="title-copy">
                        <span></span>
                        <span>{{item.type == 2?'签收信息':item.type == 3?'回寄信息':'送检信息'}}</span>
                        <span></span>
                    </div>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item
                                label="蜡块"
                                prop="waxBlock"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.waxBlock"
                                    placeholder="蜡块几块"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="白片几张"
                                prop="whitePiece"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.whitePiece"
                                    placeholder="请输入白片几张"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="HE切片几张"
                                prop="HE"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.HE"
                                    placeholder="请输入HE切片几张"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="免疫组化切片"
                                prop="immunohistochemical"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.immunohistochemical"
                                    placeholder="免疫组化切片几张"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item
                                label="放射胶片"
                                prop="radiationFilm"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.radiationFilm"
                                    placeholder="请输入放射胶片几张"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="纸质文本"
                                prop="paperText"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.paperText"
                                    placeholder="请输入纸质文本几页"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="寄件人"
                                prop="consignor"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.consignor"
                                    placeholder="请输入寄件人"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="寄件人电话"
                                prop="consignorPhoneNumber"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.consignorPhoneNumber"
                                    placeholder="请输入寄件人电话"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item
                                label="寄件地址"
                                prop="sendingAddress"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.sendingAddress"
                                    placeholder="请输入寄件地址"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="收件人"
                                prop="consignee"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.consignee"
                                    placeholder="请输入收件人"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="收件人电话"
                                prop="consigneePhoneNumber"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.consigneePhoneNumber"
                                    placeholder="请输入收件人电话"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="收件地址"
                                prop="receiveAddress"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.receiveAddress"
                                    placeholder="请输入收件地址"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item
                                label="送检方式"
                                prop="inspectionMethod"
                            >
                                <el-select
                                    v-model="item.inspectionMethod"
                                    placeholder="请选择送检方式"
                                    size="mini"
                                    class="width-input-normal"
                                >
                                    <el-option
                                        v-for="item in inspectionMethodList"
                                        :key="item.id"
                                        :label="item.name"
                                        :value="item.id"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="快递公司"
                                prop="expressName"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.expressName"
                                    placeholder="请输入快递公司"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item
                                label="快递单号"
                                prop="expressNumber"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.expressNumber"
                                    placeholder="请输入快递单号"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="快递时间">
                                <el-date-picker
                                    size="mini"
                                    v-model="item.sendTime"
                                    type="datetime"
                                    placeholder="选择快递时间"
                                    class="width-input-normal"
                                    value-format="yyyy-MM-dd HH:mm:ss"
                                >
                                </el-date-picker>
                            </el-form-item>
                        </el-col>

                        <el-col
                            :span="6"
                            v-if="item.type == 2"
                        >
                            <el-form-item
                                label="签收人"
                                prop="signer"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.signer"
                                    placeholder="请输入签收人"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col
                            :span="6"
                            v-if="item.type == 2"
                        >
                            <el-form-item label="签收时间">
                                <el-date-picker
                                    size="mini"
                                    v-model="item.signTime"
                                    type="datetime"
                                    placeholder="选择签收时间"
                                    class="width-input-normal"
                                    value-format="yyyy-MM-dd HH:mm:ss"
                                >
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col
                            :span="6"
                            v-if="item.type == 3"
                        >
                            <el-form-item
                                label="回寄人"
                                prop="backer"
                            >
                                <el-input
                                    size="mini"
                                    v-model="item.backer"
                                    placeholder="请输入回寄人"
                                    class="width-input-normal"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col
                            :span="6"
                            v-if="item.type == 3"
                        >
                            <el-form-item label="回寄时间">
                                <el-date-picker
                                    size="mini"
                                    v-model="item.backTime"
                                    type="datetime"
                                    placeholder="选择回寄时间"
                                    class="width-input-normal"
                                    value-format="yyyy-MM-dd HH:mm:ss"
                                >
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row v-if="item.type == 1">
                        <el-col :span="23">
                            <el-form-item
                                label="送检备注"
                                prop="remark"
                            >
                                <el-input
                                    size="mini"
                                    type="textarea"
                                    v-model="item.remark"
                                    placeholder="请输入备注信息"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row v-if="item.type == 2">
                        <el-col :span="23">
                            <el-form-item
                                label="签收备注"
                                prop="signRemark"
                            >
                                <el-input
                                    size="mini"
                                    type="textarea"
                                    v-model="item.signRemark"
                                    placeholder="请输入备注信息"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row v-if="item.type == 3">
                        <el-col :span="23">
                            <el-form-item
                                label="回寄备注"
                                prop="receivingNotes"
                            >
                                <el-input
                                    size="mini"
                                    type="textarea"
                                    v-model="item.receivingNotes"
                                    placeholder="请输入备注信息"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
            </el-form>
        </div>
    </div>
</template>

<script>
export default {
  name: 'ConsultationExpress',
  props: ['orders', 'inspectionMethodList'],

  data() {
    return {
      expressInfo: []
    }
  },
  mounted() {
    this.getExpressInfo(this.orders.id)
  },
  methods: {
    getExpressInfo(id) {
      this.$axios({
        method: 'GET',
        url: `/expressInfo/get/by/expressInfo/${id}`
      }).then(res => {
        if (res && res.data.code === 200) {
          if (res.data.data.length > 0) {
            const result = res.data.data
            //1 送检 2 签收 3 回寄
            result.forEach(item => {
              if (item.sendingType === 1) {
                item.expressContent = JSON.parse(item.expressContent)
                item.expressContent.type = 3
                this.expressInfo.push(item.expressContent)
              } else if (item.sendingType === 0) {
                item.expressContent = JSON.parse(item.expressContent)
                item.expressContent.type = 1
                this.expressInfo.push(item.expressContent)
                if (!!item.signContent) {
                  let signInfo = {}
                  signInfo.expressContent = JSON.parse(item.signContent)
                  signInfo.expressContent.type = 2
                  this.expressInfo.push(signInfo.expressContent)
                }
              }
            })
            console.log(this.expressInfo)
          }
        }
      })
    }
  },
  computed: {}
}
</script>

<style scoped>
.width-input-normal {
  width: 100%;
  max-width: 210px;
}
</style>
